<template>
    <div>
        <ul class="cc-nav">
            <router-link :to="'/centerPage/CenterCollect/CollectRecipes/'+this.$route.params.userId" custom v-slot="{navigate,isActive}">
            <li @click="navigate" :class="isActive?'cc-active':''">收藏的菜谱</li>
            |
            </router-link>
            <router-link :to="'/centerPage/CenterCollect/CollectBill/'+this.$route.params.userId" custom v-slot="{navigate,isActive}">
            <li @click="navigate" :class="isActive?'cc-active':''">收藏的菜单</li>
            </router-link>
        </ul>
        <router-view></router-view>
    </div>
</template>
<script>

</script>

<style lang="less" scoped>
.cc-nav{
    line-height:14px;margin:20px 0 25px 0;font-size: 14px;color: #999;
    li{
        font-size: 14px;color: #999;padding: 0 10px;
        display: inline-block;
        &:hover{
            cursor: pointer;
        }
    }
    .cc-active{
        color: #000;
        font-weight: bold;
    }
}
</style>
